<%@ page language="java" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<jsp:include page="../common/common.jsp">
	<jsp:param name="title" value="日志"/>
</jsp:include>

<div class="page-header">
	<h1>
		日志列表
	</h1>
</div>

<div class="row">
	<div class="col-xs-12">
		<div class="row">
			<div class="col-xs-12">
				<div class="widget-box">
					<div class="widget-header widget-header-small">
						<h5 class="widget-title lighter">搜索栏</h5>
					</div>

					<div class="widget-body">
						<div class="widget-main">
							<form id="_form" class="form-inline">
								<label  class="col-xs-3">
									<label class="control-label" for="form-field-1"> 用户名： </label>
									<input name="account" type="text" class="form-data input-medium search-data">
								</label>
								<label  class="col-xs-7 vaildateInfo">
									<label class="control-label" for="form-field-7"> 开始时间： </label>
									<input name="startDate" type="text" class="form-data input-medium search-data date-timepicker date-timepicker1"  value="">
									<label class="control-label" style="margin-left:10px;" for="form-field-7"> 结束时间： </label>
									<input name="endDate" type="text" class="form-data input-medium search-data date-timepicker date-timepicker2"  value="">
								</label>
								<label class="tableDownload"><button id="btn" class="btn btn-primary">导出</button></label>
							</form>
						</div>
					</div>
				</div>

				<div>
					<div class="dataTables_wrapper form-inline no-footer">
						<table id="_table" class="table table-striped table-bordered table-hover dataTable no-footer">
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- page specific plugin scripts -->
<script type="text/javascript">
	$('.page-content-area').ace_ajax('loadScripts', scripts, function() {
		jQuery(function($) {
			// 列表
    		var $table = $("#_table").table({
    			url : "${_path}/admin/log/list",
    			formId : "_form",
				columns : [
			        {field:'userId', hide : true},
			        {field:'account', title:'登录名', align:'left'},
			        {field:'requestIp', title:'回应IP', mobileHide : true},
			        {field:'operationId', title:'操作ID', mobileHide : true},
			        {field:'parameter', title:'参数', mobileHide : true},
			        {field:'description', title:'描述', mobileHide : true},
			        {field:'operationTime', title:'日期', mobileHide : true}
				],
				pagination : {hide : false, pageSize : 50, pageSizes : [10, 20, 50, 100]},
				
				after : function(){
					// 权限处理
					$.permission();
				}
			});
			
			//搜索
			$(".search-data").keyup(function () { 
				$table.search();
				$("#_table").next().css("display","none");
			});
			
			$(".date-timepicker").blur(function () { 
				$(document).find(".bootstrap-datetimepicker-widget").css("display","none");
				$table.search();
				$("#_table").next().css("display","none");
			});
            
			// 取消
			$("#_cancel").click(function(){
				$table.search();
				$("#_table").next().css("display","none");
			});
			
			 //日期	
			$('.date-timepicker').datetimepicker({
				 format: 'YYYY-MM-DD HH:mm:00',//use this option to display seconds
				 icons: {
					time: 'fa fa-clock-o',
					date: 'fa fa-calendar',
					up: 'fa fa-chevron-up',
					down: 'fa fa-chevron-down',
					previous: 'fa fa-chevron-left',
					next: 'fa fa-chevron-right',
					today: 'fa fa-arrows ',
					clear: 'fa fa-trash',
					close: 'fa fa-times'
				 }
			}).next().on(ace.click_event, function(){
					$(this).prev().focus();
			});
			 
			//判断date区间
			$(document).off('blur','.date-timepicker').on('blur','.date-timepicker',function(){
				var startTime=$(".date-timepicker1").val();
				var endTime=$(".date-timepicker2").val();
				var date1=new Date(Date.parse(startTime.replace("-/g","/")));
				var date2=new Date(Date.parse(endTime.replace("-/g","/")));
				//提示错误的情况：在没有错误提示框的情况下有一项为空且另一项不为空，两项不为空且范围不对，
				if(
				   (startTime==""&&endTime!=="")
				   ||(startTime!==""&&endTime!==""&&date1>date2)
				   ){
					if($('.widget-body').find(".help-block-date").length==0){
						$('.vaildateInfo').append("<span class='help-block-date' style='color:#d16e6c;'>请输入正确的时间范围</span>");
					}
				}else if(
						(startTime==""&&endTime=="")||(startTime!==""&&endTime!==""&&date1<=date2)
						){//去掉错误框的情况：两项都为空，两项都不为空且范围对
					$('.widget-body').find('.help-block-date').remove();
				}
			});
			
			
			//日志导出
			$("#btn").click(function(){
				$("#_table").table2excel({
				exclude: ".noExl",
				name: "Excel Document Name.xlsx",
				filename: "log",
				exclude_img: true,
				exclude_links: true,
				exclude_inputs: true
				});
			});
			
		});
	});
</script>
